<script setup>
import {ref} from "vue";

let count = ref(0)

let addCount = () => {
  count.value++
}

let incrCount = (event) => {
  count.value++
  //阻止事件的默认行为
}
</script>
<template>
  <!-- 事件的绑定-->
  <div>
    <h1>count目前的值为:{{ count }}</h1>
    <!--方法事件的处理器-->
    <button v-on:click="addCount()">addCount</button>
    <br>
    <!--内联式的处理方式-->
    <button @click="count++">addCountAll</button>
    <br>
    <!--事件的修饰符.once-->
    <button @click.once="count++">addCountOnce</button>
    <br>
    <!--事件的修饰符 prevent 阻止事件的修饰符-->
    <a href="https://www.xiaomi.com" target="_blank" @click.prevent="addCount">点击prevent</a>
<!--<a href="https://www.xiaomi.com" target="_blank" @click="incrCount$(event)">点击prevent</a>-->
  </div>
</template>

<style scoped>

</style>